import React, { Component } from 'react';
import { View, Text } from 'react-native';
import { orderBaseStyle } from '../_common/style';
import { TitleCpt } from '../_components/TitleCpt';
import { CURRENCY } from '../../../../utils/helper';
import ToastUtil from '../../../../utils/toast';
export class FeeBlock extends Component {
	constructor(props) {
		super(props);
		let { feeEdit } = this.props.data || {};
		this.state = {
			listData: feeEdit || []
		}
	}
	componentWillReceiveProps (props) {
		let { feeEdit } = props.data || {};
		if (!feeEdit) return;
		this.setState({
			listData: feeEdit,
		})
	}
	_moreFn = () => {
		let { navigation, feeCallback, feeEdit, feeParams, isTransport } = this.props.data || {};
		let { tradeType, deliveryType, orderType, transportType } = feeParams || {};
		console.log('feeParams', feeParams)
		if (!tradeType) {
			ToastUtil.showWarning('请先选择业务类型');
			return
		} else if (!deliveryType) {
			ToastUtil.showWarning('请先选择交货方式');
			return
		} else if (isTransport && !transportType) {
			ToastUtil.showWarning('请先选择运输方式');
			return
		}

		navigation.navigate('NewFeeAddPage', {
			feeEdit,
			feeParams: { deliveryType, tradeType, orderType, transportType },
			callBack: (feeCallData) => {
				this.setState({
					listData: feeCallData
				}, () => {
					feeCallback && feeCallback(feeCallData);
				})
			}
		});
	}

	render () {
		let { listData } = this.state;
		let { currency } = this.props.data || {};;
		return (

			<View style={[orderBaseStyle.box, orderBaseStyle.pd8]}>
				<TitleCpt
					data={{
						title: '费用预估',
						moreText: '新增费用',
						_moreFn: this._moreFn,
						info: '(*请填写包含在合同价内的预估费用总额，单位：元)'
					}} />
				{
					listData && listData.length > 0 ? (
						listData.map((item, index) => {
							return (
								<View key={index} style={orderBaseStyle.feeBox}>
									<Text style={[orderBaseStyle.feeBoxLeft, orderBaseStyle.fontSize14]}>{item.feeName}</Text>
									<View style={orderBaseStyle.row}>
										<Text style={[orderBaseStyle.feeBoxRight, orderBaseStyle.fontSize14]}>{item.feeAmt}</Text>
										<Text style={[orderBaseStyle.feeDanwei, orderBaseStyle.fontSize14]}>{CURRENCY.getUnit(currency).text}</Text>
									</View>
								</View>
							)
						})
					) : <Text onPress={this._moreFn} style={orderBaseStyle.notgood}>请添加费用预估…</Text>
				}

			</View>
		)
	}
}

